﻿<%@ Page Language="C#" Inherits="System.Web.Mvc.ViewPage<LeanBoard.Models.ItemsCollection>" %>
<%@ Import Namespace="LeanBoard.HtmlBuilders" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
    <title>Index</title>
    <link href="../../Client/base.css" rel="stylesheet" type="text/css" />
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js" type="text/javascript"></script> 
	<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.2/jquery-ui.min.js" type="text/javascript"></script> 
    <script src="http://cdn.jquerytools.org/1.2.3/all/jquery.tools.min.js" type="text/javascript"></script>
    <script src="../../Scripts/jquery.keypad.min.js" type="text/javascript"></script>
    <link href="../../Client/jquery.keypad.alt.css" rel="stylesheet" type="text/css" />
    <script src="../../Client/jquery.tools.min.js" type="text/javascript"></script>

    <script type="text/javascript">
        $(document).ready(function () {
            //keyboard plugin http://keith-wood.name/keypad.html
            $("#search").keypad({ keypadClass: 'darkKeypad', keypadOnly: false, layout: $.keypad.qwertyLayout, prompt: '' });

            $("#search").change(function () { filterChangeRequests(); });
            $("#search").keyup(function () { filterChangeRequests(); });

            $('#notification').ajaxStart(function () {
                $(this).removeAttr('class').addClass('statusWorking').html('Working...').fadeIn();
            });

            $('#notification').ajaxSuccess(function () { });

            $("#scheduled, #analysis, #analysisReadyForReview, #analysisReview, #readyForDevelopment,  #development, #readyForCodeReview, #codeReview, #readyForApproval, #testing,  #done").sortable({ connectWith: '.list', placeholder: 'placeholder cr', opacity: '0.5', handle: '.handle',
                receive: function (event, ui) {
                    $.post(
                    "/leanboard/Move", getValue(ui.item), function (data) {
                        $('#notification').removeAttr('class').addClass('status' + data.Status).html(data.Message).delay(5000).fadeOut().delay(500);
                        if (data.Status == 'Failure') {
                            $(ui.sender).sortable('cancel');
                        }
                    });
                    location.reload();
                }
            }).disableSelection();

            $("#standup .scrollable").scrollable({ size: 1, next: '.next', prev: '.prev', circular: true });

            $("#mainHeader").overlay({ speed: 0, closeSpeed: 0, close: '.close', target: '#standup', top: 'center', closeOnClick: false, mask: { color: '#444444', loadSpeed: 0, closeSpeed: 0, opacity: 0.55} });

            $("li").each(function () {
                $(this).find('.content').overlay({ speed: 0, closeSpeed: 0, close: '.close', target: '#singleOverlay' + $(this).attr('id'), top: 'center', closeOnClick: false, mask: { color: '#444444', loadSpeed: 0, closeSpeed: 0, opacity: 0.55} });
            });

            $(".itemPopup .profileImage").click(function () {
                var itemPopup = $(this).parent().parent();
                var itemId = itemPopup.attr('id').replace(/\D/gi, "");
                $("#responsibleSelector #relatedItemId").text(itemId);
                $("#responsibleSelector").show();
            });

            $("#responsibleSelector .profileImage").click(function () {
                var newResponsible = $(this).find("h2").text();
                var itemId = $("#responsibleSelector #relatedItemId").text();
                var unid = $("#" + itemId).find(".itemUnid").text();
                $.post(
                    "/leanboard/Assign", ({ itemUnid: unid, name: newResponsible }), function (data) {
                        $('#notification').removeAttr('class').addClass('status' + data.Status).html(data.Message).delay(5000).fadeOut().delay(500);
                    });

                $("#all" + itemId).find(".profileImage > img").attr("src", "../../Client/Profiles/" + newResponsible.replace(" ", "") + ".jpg");
                $("#standup" + itemId).find(".profileImage > img").attr("src", "../../Client/Profiles/" + newResponsible.replace(" ", "") + ".jpg");
                $("#all" + itemId).find(".profileImage > h2").text(newResponsible);
                $("#standup" + itemId).find(".profileImage > h2").text(newResponsible);
                $("#" + itemId).find(".crResponsible").text(newResponsible);
                $("#relatedItemId").text("");
                $("#responsibleSelector").hide();
            });

            $("#responsibleSelector .cancel").click(function () {
                $("#relatedItemId").text("");
                $("#responsibleSelector").hide();
            });

            $("#standup .details").click(function () {
                var index = $("#standup .scrollable").scrollable().getIndex() + 1;
                var itemUnid = $($("#standup .scrollable .items .itemPopup").get(index)).find(".itemUnid").html();
                viewDetailsForUnid($(this), itemUnid);
            });

            $("#standup .overview").click(function () {
                setChildElementsVisibilityForOverview($(this).parent());
            });

            $("#allItems .details").click(function () {
                var itemUnid = $(this).parent().find(".itemUnid").html();
                viewDetailsForUnid($(this), itemUnid);
            });

            $("#allItems .overview").click(function () {
                setChildElementsVisibilityForOverview($(this).parent());
            });
        });

        function getValue(item) {
            return { Id: $(item).find("h1").html(), DevResponsible: $(item).find(".crResponsible").html(), QaResponsible: $(item).find(".crQAResponsible").html(), Status: $(item).parent().attr("id"), Unid: $(item).find(".unid").html() };
        }

        function filterChangeRequests() {
            var searchTerm = $("#search").val().toLowerCase();
            $(".crTitle").each(function () {
                if (this.innerHTML.toLowerCase().indexOf(searchTerm) == -1) {
                    $(this).parent().parent().fadeOut(500);
                }
                else
                { $(this).parent().parent().fadeIn(500); }
            });
        }

        function viewDetailsForUnid(sender, itemUnid) {
            var iFrameHtml = getIFrameHtml(itemUnid);
            setChildElementsVisibilityForDetails(sender.parent());
            sender.parent().find(".externalContentFrame").html(iFrameHtml);
        }

        function getIFrameHtml(unid) {
            var iFrame = $('<iframe class="itemPopup"></iframe>');
            var link = 'http://plkrk-v-isdc015/DB/db0065/db006592.nsf/wvwUNID/' + unid + '?OpenDocument';
            $(iFrame).attr({ src: link });
            return iFrame;
        }

        function setChildElementsVisibilityForOverview(parentElement) {
            parentElement.find(".scrollable").show();
            parentElement.find(".itemPopup").show();
            parentElement.find(".externalContentFrame").hide();
            parentElement.find(".prev").show();
            parentElement.find(".overview").hide();
            parentElement.find(".next").show();
            parentElement.find(".details").show();            
        }

        function setChildElementsVisibilityForDetails(parentElement) {
            parentElement.find(".scrollable").hide();
            parentElement.find(".itemPopup").hide();
            parentElement.find(".externalContentFrame").show();
            parentElement.find(".prev").hide();
            parentElement.find(".overview").show();
            parentElement.find(".next").hide();
            parentElement.find(".details").hide();
        }
	</script>

</head>
<body>
    <div class="main">
        <div id="responsibleSelector">
            <span id="relatedItemId" style="display:none;"></span>
            <%= new ItemHtmlBuilder().BuildResponsiblesGallery(Request.PhysicalApplicationPath) %>
            <div class="cancel">Cancel</div>
        </div>
        <div id="notificationContainer">
            <div id="notification" class="statusSuccess">Ready<br />Steady</div>
        </div>
        <div class="searchArea" style="float:right;">
          <% using (Html.BeginForm()) { %>
               <label for="search">Search</label>
               <%= Html.TextBox("search")%>
          <% } %>
        </div>
        <h1 id="mainHeader">Operations Development WIP (10)</h1>        
        <div id="board">
            <div id="groupHeaders">
                <h1 class="columnGroup groupScheduled columnHeader">Scheduled</h1>
                <h1 class="columnGroup groupAnalysis columnHeader leftBorderSolid">Analysis</h1>
                <h1 class="columnGroup groupDevelopment columnHeader leftBorderSolid">Development</h1>
                <h1 class="columnGroup groupTesting columnHeader leftBorderSolid">Testing</h1>
            </div>
            <div class="column scheduledGroup">
                <h2 class="columnHeader">Queue<br /> ( <%= Model.Scheduled.Count%> )</h2>
                <ul id="scheduled" class="list">
                    <%= new ItemHtmlBuilder().BuildBoardItemsHtml(Model.Scheduled) %>
                </ul>
            </div>
            <div class="column analysisGroup leftBorderSolid">
                <h2 class="columnHeader">In Progress <br />( <%= Model.Analysis.Count%> )</h2>
                <ul id="analysis" class="list">
                    <%= new ItemHtmlBuilder().BuildBoardItemsHtml(Model.Analysis) %>
                </ul>
            </div>
            <div class="column analysisGroup">
                <h2 class="columnHeader">Ready for <br /> ( <%= Model.AnalysisReadyForReview.Count%> )</h2>
                <ul id="analysisReadyForReview" class="list leftBorderDotted">
                    <%= new ItemHtmlBuilder().BuildBoardItemsHtml(Model.AnalysisReadyForReview) %>
                </ul>
            </div>
            <div class="column analysisGroup">
                <h2 class="columnHeader">Review <br />( <%= Model.AnalysisReview.Count%> )</h2>
                <ul id="analysisReview" class="list leftBorderDotted">
                    <%= new ItemHtmlBuilder().BuildBoardItemsHtml(Model.AnalysisReview) %>
                </ul>
            </div> 
            <div class="column developmentGroup leftBorderSolid">
                <h2 class="columnHeader">Ready for <br /> ( <%= Model.ReadyForDevelopment.Count%> )</h2>
                <ul id="readyForDevelopment" class="list">
                    <%= new ItemHtmlBuilder().BuildBoardItemsHtml(Model.ReadyForDevelopment) %>
                </ul>
            </div>
            <div class="column developmentGroup">
                <h2 class="columnHeader">Development <br /> ( <%= Model.Development.Count%> )</h2>
                <ul id="development" class="list leftBorderDotted">
                    <%= new ItemHtmlBuilder().BuildBoardItemsHtml(Model.Development) %>
                </ul>
            </div>
            <div class="column developmentGroup">
                <h2 class="columnHeader">Ready for <br /> ( <%= Model.ReadyForCodeReview.Count%> )</h2>
                <ul id="readyForCodeReview" class="list leftBorderDotted">
                    <%= new ItemHtmlBuilder().BuildBoardItemsHtml(Model.ReadyForCodeReview) %>
                </ul>
            </div>
            <div class="column developmentGroup">
                <h2 class="columnHeader">Code Review <br /> ( <%= Model.CodeReview.Count%> )</h2>
                <ul id="codeReview" class="list leftBorderDotted">
                    <%= new ItemHtmlBuilder().BuildBoardItemsHtml(Model.CodeReview) %>
                </ul>
            </div>
            <div class="column testingGroup leftBorderSolid">
                <h2 class="columnHeader">Ready for <br /> ( <%= Model.ReadyForApporval.Count%> )</h2>
                <ul id="readyForApproval" class="list">
                    <%= new ItemHtmlBuilder().BuildBoardItemsHtml(Model.ReadyForApporval) %>
                </ul>
            </div>
            <div class="column testingGroup">
                <h2 class="columnHeader">Testing <br /> ( <%= Model.Testing.Count%> )</h2>
                <ul id="testing" class="list leftBorderDotted">
                    <%= new ItemHtmlBuilder().BuildBoardItemsHtml(Model.Testing) %>
                </ul>
            </div>            
            <div class="column testingGroup">
                <h2 class="columnHeader">Done <br /> ( <%= Model.Done.Count%> )</h2>
                <ul id="done" class="list leftBorderDotted">
                    <%= new ItemHtmlBuilder().BuildBoardItemsHtml(Model.Done) %>
                </ul>
            </div>
        </div>
    </div>    

    <div id="standup" class="apple_overlay standupBody">
        <div class="prev">< Previous</div>
        <div class="overview">Overview</div>
        <div class="next">Next ></div>
        <div class="details">Details</div>
        <div class="close">Close</div>
        <div class="scrollable">
            <div class="items">
                <%= new ItemHtmlBuilder().BuildStandupItems(Model) %>
            </div>
        </div>
        <div class="externalContentFrame"></div>
    </div>

    <div id="allItems">
        <%= new ItemHtmlBuilder().BuildAllItems(Model) %>
    </div>
</body>
</html>
